import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import * as path from 'path'
import eslintPlugin from 'vite-plugin-eslint'
import { viteMockServe } from 'vite-plugin-mock'
// https://vitejs.dev/config/
export default defineConfig(({ command, mode }) => {
  return {
    plugins: [
      vue(),
      viteMockServe({
        mockPath: './src/mock',
        enable: command === 'serve' && mode === 'mock'
      }),
      // 配置vite在运行的时候自动检测eslint规范
      eslintPlugin({
        include: ['src/**/*.ts', 'src/**/*.js', 'src/**/*.vue', 'src/*.ts', 'src/*.js', 'src/*.vue']
      })
    ],
    server: {
      host: '0.0.0.0', // 服务器主机名，如果允许外部访问，可设置为"0.0.0.0"
      open: true, //允许自动打开浏览器
      proxy: {
        '/api': {
          // 配置需要代理的路径 --> 这里的意思是代理http://localhost:80/api/后的所有路由
          target: 'http://jsonplaceholder.typicode.com', // 目标地址 --> 服务器地址
          changeOrigin: true, // 允许跨域
          ws: true, // 允许websocket代理
          // 重写路径 --> 作用与vue配置pathRewrite作用相同
          rewrite: path => path.replace(/^\/api/, ''),
          bypass(req, res, options) {
            const proxyURL = options.target + options.rewrite(req.url)
            req.headers['x-req-proxyURL'] = proxyURL // 设置未生效
            res.setHeader('x-req-proxyURL', proxyURL) // 设置响应头可以看到
          }
        }
      }
    },
    resolve: {
      //设置别名
      alias: {
        '@': path.resolve(__dirname, 'src')
      }
    },
    css: {
      preprocessorOptions: {
        less: {
          modifyVars: {
            hack: `true; @import (reference) "${path.resolve('src/assets/css/base.less')}";`
          },
          javascriptEnabled: true
        }
      }
    }
  }
})
